<div class="bug-detail">
    <div class="bug-detail-left">
        <div class="bug-detail-left-top">
            <h3>{{del?.bugName}}</h3>
            <p>
                <span><font>提交人：</font>{{del?.nickname}}</span>
                <span><font>类型：</font>{{del?.bugCateType}}</span>
                <span><font>当前状态：</font>{{del?.status | reportQualityPipe}}</span>
                <span><font>漏洞等级：</font>{{del?.bugLevel | bugLevelPipe}}</span><br>
                <span><font>所属项目：</font>{{del?.projectName}}</span>
            </p>
        </div>
        <div class="bug-detail-left-bottom">
            <h3>漏洞详情</h3>
            <div class="bug-detail-content">
                <div class="bug-detail-content-title">
                    <div class="icon"><img src="../../../../assets/img/bugDetail/bug-icon.png" /></div>
                    <div class="title" style="line-height: 60px;">
                        <span>匿名</span>为<span>{{del?.projectName}}</span>提交了一个漏洞，自评级别为<a class="high">{{del?.bugLevel | bugLevelPipe}}</a>
                    </div>
                    <div class="time" style="line-height: 60px;">
                        {{del?.createTime}}
                    </div>
                </div>
                <div class="bug-detail-content-box">
                    <dl>
                        <dt>漏洞URL/位置：</dt>
                        <dd>{{del?.bugUrl}}</dd>
                    </dl>
                    <dl>
                        <dt>漏洞POC：</dt>
                        <dd>{{del?.bugPoc}}</dd>
                    </dl>
                    <dl>
                        <dt>复现步骤：</dt>
                        <dd class="html-box" [ngClass]="{'all':isShow1}">
                            <div #bugRealizeStep [innerHTML]="del?.bugRealizeStep | safeHtml"></div>
                            <p *ngIf="show1" class="more">
                                <a *ngIf="!isShow1" (click)="toggle1()">查看全部</a>
                                <a *ngIf="isShow1" (click)="toggle1()">收起内容</a>
                            </p>
                        </dd>
                    </dl>
                    <dl>
                        <dt>修复方式：</dt>
                        <dd class="html-box" [ngClass]="{'all':isShow2}">
                            <div #bugFixPlan [innerHTML]="del?.bugFixPlan | safeHtml"></div>
                            <p *ngIf="show2" class="more">
                                <a *ngIf="!isShow2" (click)="toggle2()">查看全部</a>
                                <a *ngIf="isShow2" (click)="toggle2()">收起内容</a>
                            </p>
                        </dd>
                    </dl>
                </div>
            </div>
            <div class="bug-detail-content">
                <div class="bug-detail-content-title">
                    <div class="icon"><img src="../../../../assets/img/bugDetail/warn-icon.png" /></div>
                    <div class="title">
                        <span>漏洞之盾</span>
                        建议您自主保留以下信息：测试过程记录、截图、漏洞视频。如发生争议，以上内容会作为判定证据
                    </div>
                    <div class="time">
                        <!-- 2019-12-21 17:56 -->
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="bug-detail-right">
        <div class="bug-detail-right-box">
            <div class="bug-detail-right-box-head">
                <span>漏洞处理状态</span>
            </div>
            <div class="bug-detail-right-box-body">
                <div class="status-box">
                    <div class="status-box-item" [ngClass]="{ 'checked': del?.status == 'CREATED' || del?.status == 'CONFIRMED' || del?.status == 'PENDING_AUDIT' || del?.status == 'INVALID'}">
                        <div class="icon"></div>
                        <h3>待审阅</h3>
                        <p>漏洞已提交，等待审阅</p>
                    </div>
                    <div class="status-box-item" [ngClass]="{ 'checked': del?.status == 'CONFIRMED' || del?.status == 'PENDING_AUDIT' || del?.status == 'INVALID' }">
                        <div class="icon"></div>
                        <h3>待确认</h3>
                        <p>漏洞已审阅，等待确认</p>
                    </div>
                    <div class="status-box-item" [ngClass]="{ 'checked': del?.status == 'PENDING_AUDIT' || del?.status == 'INVALID' }">
                        <div class="icon"></div>
                        <h3>待修复</h3>
                        <p>漏洞已确认</p>
                    </div>
                    <div class="status-box-item" [ngClass]="{ 'checked': del?.status == 'INVALID' }">
                        <div class="icon"></div>
                        <h3>已关闭</h3>
                        <p>漏洞已关闭</p>
                    </div>
                    <!-- <div class="status-box-item">
                        <div class="icon"></div>
                        <h3>已公开</h3>
                        <p>厂商同意公开此漏洞</p>
                    </div> -->
                </div>
            </div>
        </div>  
    </div>
</div>